<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%String path = request.getContextPath();%>
<html>
<head>
    <title>Title</title>
    <script>
        $(function (){
            $('#testfile').fileinput({
                language: 'zh',
                uploadUrl: '<%=path%>/file/upLoadFile',
                maxFileCount: 1,
                maxFileSize: 10240,
                allowedFileExtensions: ["jpg","png","gif"],
                browseClass: 'btn btn-primary',
                enctype : "multipart/form-data"
            });
            $("#testfile").on("fileuploaded",function (event,data,previewId,index){
                console.log(data);
                var imgUrl =  data.response.imgUrl;
                $("#skillImg").val(imgUrl);
            })
        })
    </script>
</head>
<body>
    <form role="form" id="skill_add_form">
        <div class="form-group">
            <label for="skillName">技能名:</label>
            <input type="text" class="form-control" id="skillName" name="skillName" placeholder="技能名">
        </div>

        <div class="form-group">
            <label for="skillDescribe">技能描述:</label>
            <input type="text" class="form-control" id="skillDescribe" name="skillDescribe" placeholder="技能描述">
        </div>

        <div class="form-group">
            <label for="skillEvaluate">技能备注:</label>
            <input type="text" class="form-control" id="skillEvaluate" name="skillEvaluate" placeholder="技能备注">
        </div>

        <div class="form-group">
            <label>稀有度:</label>
            <select name="rightId">
                <c:forEach items="${rights}" var="p">
                    <option value="${p.rightId}">${p.rightGrade}</option>
                </c:forEach>
            </select>
        </div>

        <div class="form-group" style="width:300px;height:300px">
            <label for="testfile">技能样式:</label>
            <input type="file" id="testfile" name="myFile" multiple />
            <input type="hidden" name="skillImg" id="skillImg">
        </div>

    </form>
</body>
</html>
